// pages/location/index.js
const app = getApp()
const {
    getLocationData
} = require('../../services/api/location.js')
const {coordsData} = require('./data.js')
Page({
    data: {
        offlineCustom: true,//线下定制按钮
        floors: [{
            id: 1,
            name: '-1F'
        },
            {
                id: 2,
                name: '1F'
            },
            {
                id: 3,
                name: '2F'
            },
            {
                id: 4,
                name: '3F'
            },
            {
                id: 5,
                name: '4F'
            },
        ],
        floorIndex: 0,
        areas: [],
        floorsImg: '',
        closeToast: '',
        offlineCustom: false,
        scrollTop: 0, // 初始滚动位置为顶部
        mapNoHrefAreas: {
            circle: [], rect: [], poly: []
        },
        currentItem: {}
    },
    onLoad() {

        this.loadData()
    },
    onShow() {
        app.initPageLang(this)
        this.isOfflineCustom()
    },
    isOfflineCustom() {
        this.setData({
            offlineCustom: app.data.offlineCustom
        })
        app.getUnmakeList(() => {
            this.setData({
                offlineCustom: app.data.offlineCustom
            })
        })
    },
    scrollToLeft() {
        this.setData({
            scrollLeft: 0
        });
    },
    scrollToRight() {
        const query = wx.createSelectorQuery();
        query.select('.nav-box').boundingClientRect();
        query.select('.nav-box').scrollOffset();
        query.exec((res) => {
            const scrollViewWidth = res[0].width;
            const scrollContentWidth = res[1].scrollWidth;
            const scrollLeft = scrollContentWidth - scrollViewWidth;
            this.setData({
                scrollLeft
            });
        });
    },
    onNextFloor() {
        if (this.data.floorIndex === this.data.floors.length - 1) {
            return;
        }
        this.onSelectItem(({
            currentTarget: {
                dataset: {
                    item: this.data.floors[this.data.floorIndex + 1],
                }
            }
        }))
        if (this.data.floorIndex > 3) {
            this.scrollToRight();
        }
    },
    onPreviousFloor() {
        if (this.data.floorIndex === 0) {
            return;
        }
        this.onSelectItem(({
            currentTarget: {
                dataset: {
                    item: this.data.floors[this.data.floorIndex - 1],
                }
            }
        }))
        if (this.data.floorIndex < 2) {
            this.scrollToLeft();
        }
    },
    onSelectItem({
                     currentTarget: {
                         dataset: {
                             item
                         }
                     }
                 }) {

        this.setData({
            scrollTop: 0 // 将滚动位置设置为顶部
        });

        let floorIndex = 0
        const floor = this.data.floors.find((x, i) => {
            if (x.id == item.id) {
                floorIndex = i
                return true
            }
        })

        this.setData({
            areas: floor.subzones,
            floorsImg: floor.imgBig,
            currentItem: item.subzones[0],
            floorIndex,
            mapHrefAreas: {
                circle: [], rect: [],
                poly: coordsData[floorIndex]
            }
        })
    },
    onSwiperChange({detail}){
        this.onSelectItem({
            currentTarget: {
                dataset: {
                    item: {
                        id: this.data.floors[detail.current].id,
                        subzones: this.data.floors[detail.current].subzones
                    }
                }
            }
        })
    },
    loadData() {
        getLocationData().then(res => {
            if (res.code == 0) {
                const floors = res.info.map((x, index) => {
                    if (Array.isArray(x.subzones)) {
                        x.subzones = x.subzones.map(_ => ({
                            ..._,
                            id: _.id + '',
                            floorId: _.floorId + '',
                        }))
                    } else {
                        x.subzones = []
                    }
                    return {
                        ...x,
                        id: x.id + '',
                        mapHrefAreas: {
                            circle: [], rect: [],
                            poly: coordsData[index]
                        },
                    }
                })
                console.log(floors, "floors");
                this.setData({
                    floors,
                    floorIndex: 0,
                    currentItem: floors[0].subzones[0]
                })

                console.log(this.data.areas);
            }
        })
    },
    inside(e) {
        let param = e.detail.param;
        console.info('inside', param);
        if (!this.data.floors[this.data.floorIndex].subzones[param.index]) {
            return;
        }
        this.setData({
            currentItem: this.data.floors[this.data.floorIndex].subzones[param.index]
        })
    },
    outside(e) {
        console.log(e)
    }
})